﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/MapPageSiteMaster.Master"
    Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    巡店总览
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div class="section-header">
        <div class="title">
            <img src="<%=Url.Content("~/Content/images/ico-catalog.png")%>" alt="" />
            巡店总览
        </div>
        <div class="options">
            <input type="button" id="btnQuery" value="查询" class="t-button" />
        </div>
    </div>
    <table class="adminContent">
        <tr>
            <td class="adminTitle">
                省份
            </td>
            <td class="adminData">
                <select>
                    <option value="湖北">湖北</option>
                </select>
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                城市
            </td>
            <td class="adminData">
                <select>
                    <option value="武汉">武汉</option>
                </select>
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                图标说明
            </td>
            <td class="adminData">
                <table>
                    <tr>
                        <td>
                            <img src="<%=Url.Content("~/Content/images/cars/store.PNG")%>" />
                        </td>
                        <td>
                            东风4S(二网)店
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <img src="<%=Url.Content("~/Content/images/cars/cmpStore.PNG")%>" />
                        </td>
                        <td>
                            竞争对手
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <img src="<%=Url.Content("~/Content/images/cars/protal.PNG")%>" />
                        </td>
                        <td>
                            巡店中
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <img src="<%=Url.Content("~/Content/images/cars/event.PNG")%>" />
                        </td>
                        <td>
                            事件
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>
    <div id="container">
    </div>
    <script type="text/javascript">
        var subKaInfo = "<table class='adminContent'>" +
            "<tr><td class='adminTitle'>门店名称:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>最近一次巡店时间:</td><td class='adminData'>2014-01-09</td></tr>" +
            "<tr><td class='adminTitle'>下一次巡店时间:</td><td class='adminData'>2014-02-09</td></tr>" +
            "<tr><td class='adminTitle'>计划巡店人:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>巡店情况:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "<tr><td class='adminTitle'>销售报表:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "</table>";

        var subKaProtalInfo = "<table class='adminContent'>" +
            "<tr><td class='adminTitle'>门店名称:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>巡店人:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>巡店情况:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "<tr><td class='adminTitle'>销售报表:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "</table>";

        var subKaEventInfo = "<table class='adminContent'>" +
            "<tr><td class='adminTitle'>门店名称:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>最近一次巡店时间:</td><td class='adminData'>2014-01-09</td></tr>" +
            "<tr><td class='adminTitle'>下一次巡店时间:</td><td class='adminData'>2014-02-09</td></tr>" +
            "<tr><td class='adminTitle'>计划巡店人:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>巡店情况:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "<tr><td class='adminTitle'>销售报表:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "<tr><td class='adminTitle'>重大事件:</td><td class='adminData'>xxxxx</td></tr>" +
            "<tr><td class='adminTitle'>事件等级:</td><td class='adminData'>xxxxx</td></tr>" +
            "<tr><td class='adminTitle'>事件描述:</td><td class='adminData'>xxxxx</td></tr>" +
            "</table>";

        var cmpStore = "<table class='adminContent'>" +
            "<tr><td class='adminTitle'>名称:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>竞品名称:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>竞品概述:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "<tr><td class='adminTitle'>历史信息:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "</table>";

        var cmpEventStore = "<table class='adminContent'>" +
            "<tr><td class='adminTitle'>名称:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>竞品名称:</td><td class='adminData'>xxxx</td></tr>" +
            "<tr><td class='adminTitle'>竞品概述:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "<tr><td class='adminTitle'>历史信息:</td><td class='adminData'><a href='#'>详情</a></td></tr>" +
            "<tr><td class='adminTitle'>重大事件:</td><td class='adminData'>xxxxx</td></tr>" +
            "<tr><td class='adminTitle'>事件等级:</td><td class='adminData'>xxxxx</td></tr>" +
            "<tr><td class='adminTitle'>事件描述:</td><td class='adminData'>xxxxx</td></tr>" +
            "</table>";
        var txtMenuItem = [
                              {
                                  text: '添加4S店',
                                  callback: function (p) {
                                      alert("添加成功");
                                  }
                              },
                              {
                                  text: '添加竞争门店',
                                  callback: function (p) { alert("添加成功"); }
                              }
                              ,
                              {
                                  text: '添加竞品信息',
                                  callback: function () { alert("添加成功"); }
                              }
                              ,
                              {
                                  text: '添加事件',
                                  callback: function () { alert("添加成功"); }
                              }
                             ];
        $(document).ready(function () {
            var map = new BMap.Map("container");          // 创建地图实例  
            map.centerAndZoom("武汉", 11);                 // 初始化地图，设置中心点坐标和地图级别  
            map.addControl(new BMap.NavigationControl());  //添加默认缩放平移控件
            map.addControl(new BMap.NavigationControl({ anchor: BMAP_ANCHOR_TOP_RIGHT, type: BMAP_NAVIGATION_CONTROL_SMALL }));  //右上角，仅包含平移和缩放按钮
            map.addControl(new BMap.NavigationControl({ anchor: BMAP_ANCHOR_BOTTOM_LEFT, type: BMAP_NAVIGATION_CONTROL_PAN }));  //左下角，仅包含平移按钮
            map.addControl(new BMap.NavigationControl({ anchor: BMAP_ANCHOR_BOTTOM_RIGHT, type: BMAP_NAVIGATION_CONTROL_ZOOM }));  //右下角，仅包含缩放按钮
            map.enableScrollWheelZoom();

            var menu = new BMap.ContextMenu();
            for (var i = 0; i < txtMenuItem.length; i++) {
                menu.addItem(new BMap.MenuItem(txtMenuItem[i].text, txtMenuItem[i].callback, 100));
            }
            map.addContextMenu(menu);

            function showInfo1() {
                var infoWindow = new BMap.InfoWindow(subKaInfo);
                this.openInfoWindow(infoWindow);
            }

            function showInfo2() {
                var infoWindow = new BMap.InfoWindow(subKaProtalInfo);
                this.openInfoWindow(infoWindow);
            }

            function showInfo3() {
                var infoWindow = new BMap.InfoWindow(subKaEventInfo);
                this.openInfoWindow(infoWindow);
            }

            function showInfo4() {
                var infoWindow = new BMap.InfoWindow(cmpStore);
                this.openInfoWindow(infoWindow);
            }

            function showInfo5() {
                var infoWindow = new BMap.InfoWindow(cmpEventStore);
                this.openInfoWindow(infoWindow);
            }


            //显示各个门店
            setSubKA(114.083072, 30.459789);
            setSubKA(114.317201, 30.550061);
            setProtalSubKA(114.259248, 30.589092);
            setEventSubKA(114.410067, 30.463278);
            setSubKA(114.121434, 30.618307);
            setSubKA(114.287359, 30.633215);
            //显示竞争对手门店
            setCMPSubKA(114.41137, 30.515777);
            setCMPEventSubKA(114.269366, 30.551611);

            function setSubKA(lng, lat) {
                var pt = new BMap.Point(lng, lat);
                var myIcon = new BMap.Icon('<%=Url.Content("~/Content/images/cars/store.PNG")%>', new BMap.Size(40, 38));
                var marker = new BMap.Marker(pt, { icon: myIcon });  // 创建标注
                map.addOverlay(marker);
                marker.addEventListener("click", showInfo1);
            }

            function setCMPSubKA(lng, lat) {
                var pt = new BMap.Point(lng, lat);
                var myIcon = new BMap.Icon('<%=Url.Content("~/Content/images/cars/cmpStore.PNG")%>', new BMap.Size(31, 30));
                var marker = new BMap.Marker(pt, { icon: myIcon });  // 创建标注
                map.addOverlay(marker);
                marker.addEventListener("click", showInfo4);
            }

            function setCMPEventSubKA(lng, lat) {
                var pt = new BMap.Point(lng, lat);
                var myIcon = new BMap.Icon('<%=Url.Content("~/Content/images/cars/cmpEvent.PNG")%>', new BMap.Size(64, 31));
                var marker = new BMap.Marker(pt, { icon: myIcon });  // 创建标注
                map.addOverlay(marker);
                marker.addEventListener("click", showInfo5);
            }

            function setEventSubKA(lng, lat) {
                var pt = new BMap.Point(lng, lat);
                var myIcon = new BMap.Icon('<%=Url.Content("~/Content/images/cars/storeEvent.PNG")%>', new BMap.Size(72, 43));
                var marker = new BMap.Marker(pt, { icon: myIcon });  // 创建标注
                map.addOverlay(marker);
                marker.addEventListener("click", showInfo3);
            }

            function setProtalSubKA(lng, lat) {
                var pt = new BMap.Point(lng, lat);
                var myIcon = new BMap.Icon('<%=Url.Content("~/Content/images/cars/storeProtal.PNG")%>', new BMap.Size(68, 39));
                var marker = new BMap.Marker(pt, { icon: myIcon });  // 创建标注
                map.addOverlay(marker);
                marker.addEventListener("click", showInfo2);
            }

            $('#btnQuery').click(function () {
                var address = $('#Address').val();
                if (address != '') {
                    var local = new BMap.LocalSearch(map, {
                        renderOptions: { map: map }
                    });
                    local.search(address);
                }
            });
        });
    </script>
</asp:Content>
